import React from 'react';
import { getTypeList } from '@/services/flowManage/templateMange';
import { Select, Spin } from 'antd';

const SelectCategory = (props, ref) => {
    const [data, setData] = React.useState([]);
    const [loading, setLoading] = React.useState(false);

    const fetchData = async () => {
        setLoading(true);
        const response = await getTypeList({ dictCode: 'categoryType' });
        if (response.code === 10000) {
            setData(response.data);
        }
        setLoading(false);
    };

    React.useEffect(() => {
        fetchData();
    }, []);

    const renderOptions = () =>
        data.map(item => (
            <Select.Option key={item.dictValue} value={item.dictValue}>
                {item.dictName}
            </Select.Option>
        ));

    return (
        <Spin spinning={loading}>
            <Select ref={ref} {...props}>
                {renderOptions()}
            </Select>
        </Spin>
    );
};

export default React.forwardRef(SelectCategory);
